<template>
    <div class="join">
        <div class="content">
            <nut-form label-position="top" star-position="left">
                <nut-form-item label="您的称呼">
                    <nut-input v-model="formData.name" placeholder="您的称呼" type="text" />
                </nut-form-item>
                <nut-form-item label="手机号">
                    <nut-input v-model="formData.phone" placeholder="您的手机号" type="text" />
                </nut-form-item>
                <nut-form-item label="首选加盟城市或区域">
                    <nut-input v-model="formData.city" placeholder="首选城市" type="text" />
                </nut-form-item>
                <nut-form-item label="您的资源">
                    <nut-textarea v-model="formData.text" placeholder="您有哪些资源对项目有帮助..." type="text" />
                </nut-form-item>
                <div class="btns flex-a flex-b">
                    <nut-button type="info" @click="join">立即加盟</nut-button>
                    <nut-button type="default" @click="back">退出申请</nut-button>
                </div>
            </nut-form>
        </div>
    </div>
</template>

<script lang="ts">
import Taro, { useRouter } from '@tarojs/taro';
import { Left } from '@nutui/icons-vue-taro';
import { reactive, toRefs, onMounted } from 'vue';
import { addJoin } from '../../../../api/index';
export default {
    components: {
        Left,
    },
    setup() {
        const data = reactive({
            formData: {}
        });
        const jumpTo = (path) => {
            Taro.navigateTo({ url: path });
        }
        const join = () => {
            addJoin(data.formData).then(res => {
                if (res.code == 0) {
                    Taro.showToast({
                        title: '提交成功！',
                        icon: 'success',
                        duration: 2000
                    })
                    setTimeout(() => {
                        jumpTo('/packageA/pages/mypage/index')
                    }, 500)
                }
            })
        }
        const back = () => {
            jumpTo('/packageA/pages/mypage/index')
        }
        return {
            ...toRefs(data), jumpTo, join, back
        }
    }
};
</script>


<style lang="scss">
.join {

    .btns {
        padding: 0 20rpx 40rpx;

        .nut-button {
            width: 40%;
        }
    }
}
</style>